{% extends "base.html" %}
{% block title %}{% endblock %}
{% block head %}{% endblock %}
{% block external %}

<script type="text/javascript">		
	$(function () {
		window.app = Appetizor.setup({{ dishes_json|safe }},
			{"showMap":true}
		);
		
		$("#newest-filter").click(function () {
			window.app.dishCollection.url = "/api/dishes/t/1/";
			window.app.dishCollection.fetch();
			window.app.dishCollect.refresh();
			return false;
		});					
	});
</script>
{% endblock %}
{% block header %}
{% endblock %}
{% block content %}

<div id="slideout-panel">
	<div class="panel-toolbar">
		<span class="panel-close-btn">close <span>x</span></span>
	</div>
	<div id="panel-content"></div>
</div>


<!--
<div id="intro">
nomenom is a fun way to discover the best of your favorite foods. Join us now!
</div>
-->


<form id="search_form" method="get" action="/search/">
	{{ search_form.query }}
	{{ search_form.location }}
	<input type="submit" value="Search" class="search_button rounded"><!-- class="search_button shadow rounded"/>-->
</form>

<div id="browse-block">

</div>

<div id="left-container" class="clearfix">
	<!--<ul class="filters">
		<a href="/api/dishes/filter/newest"><li id="newest-filter">Newest</li></a>
		<a href="/api/dishes/filter/best"><li id="best-filter">Best</li></a>
		<a href="/api/dishes/filter/popular"><li id="popular-filter">Popular</li></a>
		<li id="filter-btn">Filter</li>
	</ul>
	<div id="filter-panel">
		<div id="filter-details">
			burger
		</div>
	</div>
	-->
	
	<ol id="dish-list">
	</ol>
	<a href="#">Create New</a>
</div>

<div id="right-container" class="clearfix">
	<!--<a href="/register"><div class="join-now">Sign Up</div></a>-->
	<div id="map-canvas"></div>
</div>

{% endblock %}